import 'package:flutter/material.dart';

import 'package:wanchong/path.dart';
import 'package:flutter_swiper/flutter_swiper.dart';

class Konw extends StatefulWidget {
  @override
  _KonwState createState() => _KonwState();
}

class _KonwState extends State<Konw> {
  var startColor = 0;
  var bannerList = [
    'assets/pet/equipment_ad_a_img.png',
    'assets/pet/equipment_ad_a_img.png',
    'assets/pet/equipment_ad_a_img.png',
    'assets/pet/equipment_ad_a_img.png',
  ];
  @override
  Widget build(BuildContext context) {
    return Container(
      decoration: BoxDecoration(
        image: DecorationImage(
          image: startColor == 0
              ? AssetImage('assets/store/my_bg_top_2_img.png')
              : AssetImage('assets/bottom/navigation_icon_home_a.png'),
          fit: BoxFit.contain,
          alignment: Alignment.topCenter,
        ),
      ),
      child: Scaffold(
        backgroundColor: Color(0x00000000), //把scaffold的背景色改成透明
        appBar: new AppBar(
          elevation: 0.0,
          backgroundColor:
              startColor == 0 ? Colors.transparent : Color(0xFFFFCC33),
          automaticallyImplyLeading: false, //去掉返回按钮
          title: new Container(
            height: 35.0,
            decoration: BoxDecoration(
              border: Border.all(color: Color(0xFFFAFAFA), width: 1.0),
              color: Colors.white,
              borderRadius: BorderRadius.circular(5.0),
            ),
            child: GestureDetector(
              onTap: () {
                Navigator.of(context).pushNamed(InfosearchPath);
              },
              child: Container(
                color: Colors.white,
                child: Row(
                  children: <Widget>[
                    Expanded(
                      child: Container(
                        height: 30.0,
                      ),
                    ),
                    Icon(Icons.search, color: Color(0xFF647280), size: 20.0),
                    Text(
                      '搜索',
                      style: new TextStyle(
                        fontSize: 14,
                        color: Color(0xFF647280),
                      ),
                    ),
                    Expanded(
                      child: Container(
                        height: 30.0,
                      ),
                    ),
                  ],
                ),
              ),
            ),
          ),
        ),

        body: Container(
          child: NotificationListener(
            onNotification: (ScrollNotification note) {
              //(notification.metrics.extentAfter == 0.0) 为滑动到 底部；
              //(notification.metrics.extentBefore == 0.0) 为滑动到 顶部。
              //print(note.metrics.extentBefore); // 滚动位置。
              //print(note.metrics.pixels.toInt()); // 滚动位置。
              if (note.metrics.pixels.toInt() > 50 &&
                  note.metrics.pixels.toInt() < 3000) {
                setState(() {
                  this.startColor = 1;
                });
              } else if (note.metrics.pixels.toInt() < 3000) {
                setState(() {
                  this.startColor = 0;
                });
              }
            },
            child: ListView(
              physics: BouncingScrollPhysics(),
              children: <Widget>[
                Container(
                  margin: EdgeInsets.only(left: 15.0, right: 15.0),
                  decoration: BoxDecoration(
                      border: Border.all(color: Color(0x08000000), width: 1.0),
                      color: Colors.white,
                      borderRadius: BorderRadius.circular(5.0)),
                  height: 255.0,
                  child: Stack(
                    children: <Widget>[
                      fenlWidget(),
                      Positioned(
                        child: Container(
                          child: Row(
                            children: <Widget>[
                              Container(
                                height: 40.0,
                                color: Colors.white,
                                alignment: Alignment.center,
                                margin: EdgeInsets.only(left: 15.0),
                                child: Text(
                                  '顽宠视讯',
                                  style: TextStyle(
                                      fontSize: 14.0,
                                      fontWeight: FontWeight.w700,
                                      color: Color(0xFF3C4450)),
                                ),
                              ),
                              Expanded(
                                child: Container(
                                  height: 40.0,
                                ),
                              ),
                              GestureDetector(
                                onTap: () {
                                  Navigator.of(context)
                                      .pushNamed(VideoselectPath);
                                },
                                child: Container(
                                  height: 40.0,
                                  color: Colors.white,
                                  alignment: Alignment.center,
                                  child: Text(
                                    '全部视频',
                                    style: TextStyle(
                                      fontSize: 11.0,
                                      color: Color(0xFFB4BEC6),
                                    ),
                                  ),
                                ),
                              ),
                              Container(
                                margin: EdgeInsets.only(
                                    left: 7.0, top: 2.0, right: 15.0),
                                child: Image.asset(
                                  'assets/user/center_order_icon_fanhui.png',
                                  width: 5,
                                  height: 10,
                                ),
                              ),
                            ],
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
                Container(
                  margin: EdgeInsets.only(left: 15.0, right: 15.0, top: 15.0),
                  height: 140.0,
                  child: Stack(
                    children: <Widget>[
                      new Positioned(
                        child: Container(
                          margin: EdgeInsets.only(
                            left: 5.0,
                            right: 5.0,
                          ),
                          height: 140.0,
                          decoration: BoxDecoration(
                              border: Border.all(
                                  color: Color(0x08000000), width: 1.0),
                              color: Colors.white,
                              borderRadius: BorderRadius.circular(5.0)),
                        ),
                      ),
                      new Positioned(
                        child: Container(
                          height: 135.0,
                          decoration: BoxDecoration(
                            border: Border.all(
                                color: Color(0x08000000), width: 1.0),
                            color: Colors.white,
                            borderRadius: BorderRadius.circular(5.0),
                          ),
                          child: zsWidget(),
                        ),
                      ),
                    ],
                  ),
                ),
                Container(
                  margin: EdgeInsets.only(left: 15.0, right: 15.0, top: 15.0),
                  height: 570.0,
                  decoration: BoxDecoration(
                    border: Border.all(color: Color(0x08000000), width: 1.0),
                    color: Colors.white,
                    borderRadius: BorderRadius.circular(5.0),
                  ),
                  child: glWidget(),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }

//知识问答模块
  Widget zsWidget() {
    return Column(
      children: <Widget>[
        Container(
          margin: EdgeInsets.only(left: 15, right: 15),
          height: 50.0,
          child: Row(
            children: <Widget>[
              Text(
                '知识问答',
                style: TextStyle(
                    fontSize: 14.0,
                    fontWeight: FontWeight.w700,
                    color: Color(0xFF3C4450)),
              ),
              Expanded(
                child: Container(),
              ),
              GestureDetector(
                onTap: () {
                  Navigator.of(context).pushNamed(KnowzselectPath);
                },
                child: Text(
                  '全部问答',
                  style: TextStyle(
                    fontSize: 11.0,
                    color: Color(0xFFB4BEC6),
                  ),
                ),
              ),
              Container(
                margin: EdgeInsets.only(left: 7.0, top: 2.0),
                child: Image.asset(
                  'assets/user/center_order_icon_fanhui.png',
                  width: 5,
                  height: 10,
                ),
              ),
            ],
          ),
        ),
        Container(
          margin: EdgeInsets.only(left: 15, right: 15),
          child: Column(
            children: <Widget>[
              Container(
                height: 60.0,
                child: Row(
                  children: <Widget>[
                    Container(
                      child: Column(
                        children: <Widget>[
                          Container(
                            height: 10.0,
                          ),
                          Container(
                            width: 20,
                            height: 20,
                            margin: EdgeInsets.only(top: 0),
                            child: Image.asset(
                                'assets/user/zhishi_question_icon.png',
                                width: 20,
                                height: 20,
                                fit: BoxFit.cover),
                          ),
                          Expanded(
                            child: Container(),
                          ),
                        ],
                      ),
                    ),
                    Expanded(
                      child: GestureDetector(
                        onTap: () {
                          Navigator.of(context).pushNamed(WebviewzPath);
                        },
                        child: Container(
                          height: 50,
                          margin: EdgeInsets.only(left: 10),
                          child: Text(
                            '哺乳期柯基犬喂养需要注意些什么？营养补充可以吃什么？',
                            textAlign: TextAlign.left,
                            maxLines: 2,
                            overflow: TextOverflow.ellipsis,
                            style: new TextStyle(
                                fontSize: 18.0, color: Color(0xFF3C4450)),
                          ),
                        ),
                      ),
                    ),
                  ],
                ),
              ),
              Container(
                height: 20.0,
                child: Row(
                  children: <Widget>[
                    Text(
                      '520 浏览',
                      style:
                          TextStyle(fontSize: 12.0, color: Color(0xFFB4BEC6)),
                    ),
                    Container(
                      margin: EdgeInsets.only(left: 10.0),
                      child: Text(
                        '378 赞同',
                        style:
                            TextStyle(fontSize: 12.0, color: Color(0xFFB4BEC6)),
                      ),
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
      ],
    );
  }

  //攻略模块
  Widget glWidget() {
    return Column(
      children: <Widget>[
        Container(
          margin: EdgeInsets.only(left: 15, right: 15),
          height: 50.0,
          child: Row(
            children: <Widget>[
              Text(
                '饲养攻略',
                style: TextStyle(
                    fontSize: 14.0,
                    fontWeight: FontWeight.w700,
                    color: Color(0xFF3C4450)),
              ),
              Expanded(
                child: Container(),
              ),
              GestureDetector(
                onTap: () {
                  Navigator.of(context).pushNamed(AnswerselctPath);
                },
                child: Text(
                  '全部攻略',
                  style: TextStyle(
                    fontSize: 11.0,
                    color: Color(0xFFB4BEC6),
                  ),
                ),
              ),
              Container(
                margin: EdgeInsets.only(left: 7.0, top: 2.0),
                child: Image.asset(
                  'assets/user/center_order_icon_fanhui.png',
                  width: 5,
                  height: 10,
                ),
              ),
            ],
          ),
        ),
        GestureDetector(
          onTap: () {
            Navigator.of(context).pushNamed(VebviewsPath);
          },
          child: Container(
            margin: EdgeInsets.only(left: 15, right: 15),
            padding: EdgeInsets.only(top: 10, bottom: 1),
            decoration: BoxDecoration(
                //borderRadius: BorderRadius.circular(5.0),
                ),
            child: Column(
              children: <Widget>[
                Container(
                  height: 60.0,
                  child: Row(
                    children: <Widget>[
                      Container(
                        child: Column(
                          children: <Widget>[
                            Container(
                              height: 5.0,
                            ),
                            Container(
                              width: 50,
                              height: 50,
                              margin: EdgeInsets.only(top: 0),
                              child: Image.asset(
                                  'assets/store/profile_photo_2.png',
                                  width: 20,
                                  height: 20,
                                  fit: BoxFit.cover),
                            ),
                            Expanded(
                              child: Container(),
                            ),
                          ],
                        ),
                      ),
                      Expanded(
                        child: Container(
                          height: 50,
                          margin: EdgeInsets.only(left: 10),
                          child: Text(
                            '哺乳期柯基犬喂养需要注意些什么？营养补充可以吃什么？',
                            textAlign: TextAlign.left,
                            maxLines: 2,
                            overflow: TextOverflow.ellipsis,
                            style: new TextStyle(
                                fontSize: 18.0, color: Color(0xFF3C4450)),
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
                Container(
                  height: 20.0,
                  child: Row(
                    children: <Widget>[
                      Text(
                        '老板今天多放辣',
                        style:
                            TextStyle(fontSize: 12.0, color: Color(0xFFB4BEC6)),
                      ),
                      Container(
                        margin: EdgeInsets.only(left: 10.0),
                        child: Text(
                          '2019-02-02',
                          style: TextStyle(
                              fontSize: 12.0, color: Color(0xFFB4BEC6)),
                        ),
                      ),
                    ],
                  ),
                ),
                Container(
                  height: 1,
                  margin: EdgeInsets.only(top: 10.0),
                  color: Color(0x5eDBDBDB),
                ),
              ],
            ),
          ),
        ),
        Container(
          margin: EdgeInsets.only(left: 15, right: 15),
          padding: EdgeInsets.only(top: 10, bottom: 1),
          decoration: BoxDecoration(
              //borderRadius: BorderRadius.circular(5.0),
              ),
          child: Column(
            children: <Widget>[
              Container(
                height: 60.0,
                child: Row(
                  children: <Widget>[
                    Container(
                      child: Column(
                        children: <Widget>[
                          Container(
                            height: 5.0,
                          ),
                          Container(
                            width: 50,
                            height: 50,
                            margin: EdgeInsets.only(top: 0),
                            child: Image.asset(
                                'assets/store/profile_photo_2.png',
                                width: 20,
                                height: 20,
                                fit: BoxFit.cover),
                          ),
                          Expanded(
                            child: Container(),
                          ),
                        ],
                      ),
                    ),
                    Expanded(
                      child: Container(
                        height: 50,
                        margin: EdgeInsets.only(left: 10),
                        child: Text(
                          '哺乳期柯基犬喂养需要注意些什么？营养补充可以吃什么？',
                          textAlign: TextAlign.left,
                          maxLines: 2,
                          overflow: TextOverflow.ellipsis,
                          style: new TextStyle(
                              fontSize: 18.0, color: Color(0xFF3C4450)),
                        ),
                      ),
                    ),
                  ],
                ),
              ),
              Container(
                height: 20.0,
                child: Row(
                  children: <Widget>[
                    Text(
                      '老板今天多放辣',
                      style:
                          TextStyle(fontSize: 12.0, color: Color(0xFFB4BEC6)),
                    ),
                    Container(
                      margin: EdgeInsets.only(left: 10.0),
                      child: Text(
                        '2019-02-02',
                        style:
                            TextStyle(fontSize: 12.0, color: Color(0xFFB4BEC6)),
                      ),
                    ),
                  ],
                ),
              ),
              Container(
                height: 1,
                margin: EdgeInsets.only(top: 10.0),
                color: Color(0x5eDBDBDB),
              ),
            ],
          ),
        ),
        Container(
          margin: EdgeInsets.only(left: 15, right: 15),
          padding: EdgeInsets.only(top: 10, bottom: 1),
          decoration: BoxDecoration(
              //borderRadius: BorderRadius.circular(5.0),
              ),
          child: Column(
            children: <Widget>[
              Container(
                height: 60.0,
                child: Row(
                  children: <Widget>[
                    Container(
                      child: Column(
                        children: <Widget>[
                          Container(
                            height: 5.0,
                          ),
                          Container(
                            width: 50,
                            height: 50,
                            margin: EdgeInsets.only(top: 0),
                            child: Image.asset(
                                'assets/store/profile_photo_2.png',
                                width: 20,
                                height: 20,
                                fit: BoxFit.cover),
                          ),
                          Expanded(
                            child: Container(),
                          ),
                        ],
                      ),
                    ),
                    Expanded(
                      child: Container(
                        height: 50,
                        margin: EdgeInsets.only(left: 10),
                        child: Text(
                          '哺乳期柯基犬喂养需要注意些什么？营养补充可以吃什么？',
                          textAlign: TextAlign.left,
                          maxLines: 2,
                          overflow: TextOverflow.ellipsis,
                          style: new TextStyle(
                              fontSize: 18.0, color: Color(0xFF3C4450)),
                        ),
                      ),
                    ),
                  ],
                ),
              ),
              Container(
                height: 20.0,
                child: Row(
                  children: <Widget>[
                    Text(
                      '老板今天多放辣',
                      style:
                          TextStyle(fontSize: 12.0, color: Color(0xFFB4BEC6)),
                    ),
                    Container(
                      margin: EdgeInsets.only(left: 10.0),
                      child: Text(
                        '2019-02-02',
                        style:
                            TextStyle(fontSize: 12.0, color: Color(0xFFB4BEC6)),
                      ),
                    ),
                  ],
                ),
              ),
              Container(
                height: 1,
                margin: EdgeInsets.only(top: 10.0),
                color: Color(0x5eDBDBDB),
              ),
            ],
          ),
        ),
        Container(
          margin: EdgeInsets.only(left: 15, right: 15),
          padding: EdgeInsets.only(top: 10, bottom: 1),
          decoration: BoxDecoration(
              //borderRadius: BorderRadius.circular(5.0),
              ),
          child: Column(
            children: <Widget>[
              Container(
                height: 60.0,
                child: Row(
                  children: <Widget>[
                    Container(
                      child: Column(
                        children: <Widget>[
                          Container(
                            height: 5.0,
                          ),
                          Container(
                            width: 50,
                            height: 50,
                            margin: EdgeInsets.only(top: 0),
                            child: Image.asset(
                                'assets/store/profile_photo_2.png',
                                width: 20,
                                height: 20,
                                fit: BoxFit.cover),
                          ),
                          Expanded(
                            child: Container(),
                          ),
                        ],
                      ),
                    ),
                    Expanded(
                      child: Container(
                        height: 50,
                        margin: EdgeInsets.only(left: 10),
                        child: Text(
                          '哺乳期柯基犬喂养需要注意些什么？营养补充可以吃什么？',
                          textAlign: TextAlign.left,
                          maxLines: 2,
                          overflow: TextOverflow.ellipsis,
                          style: new TextStyle(
                              fontSize: 18.0, color: Color(0xFF3C4450)),
                        ),
                      ),
                    ),
                  ],
                ),
              ),
              Container(
                height: 20.0,
                child: Row(
                  children: <Widget>[
                    Text(
                      '老板今天多放辣',
                      style:
                          TextStyle(fontSize: 12.0, color: Color(0xFFB4BEC6)),
                    ),
                    Container(
                      margin: EdgeInsets.only(left: 10.0),
                      child: Text(
                        '2019-02-02',
                        style:
                            TextStyle(fontSize: 12.0, color: Color(0xFFB4BEC6)),
                      ),
                    ),
                  ],
                ),
              ),
              Container(
                height: 1,
                margin: EdgeInsets.only(top: 10.0),
                color: Color(0x5eDBDBDB),
              ),
            ],
          ),
        ),
        Container(
          margin: EdgeInsets.only(left: 15, right: 15),
          padding: EdgeInsets.only(top: 10, bottom: 1),
          decoration: BoxDecoration(
              //borderRadius: BorderRadius.circular(5.0),
              ),
          child: Column(
            children: <Widget>[
              Container(
                height: 60.0,
                child: Row(
                  children: <Widget>[
                    Container(
                      child: Column(
                        children: <Widget>[
                          Container(
                            height: 5.0,
                          ),
                          Container(
                            width: 50,
                            height: 50,
                            margin: EdgeInsets.only(top: 0),
                            child: Image.asset(
                                'assets/store/profile_photo_2.png',
                                width: 20,
                                height: 20,
                                fit: BoxFit.cover),
                          ),
                          Expanded(
                            child: Container(),
                          ),
                        ],
                      ),
                    ),
                    Expanded(
                      child: Container(
                        height: 50,
                        margin: EdgeInsets.only(left: 10),
                        child: Text(
                          '哺乳期柯基犬喂养需要注意些什么？营养补充可以吃什么？',
                          textAlign: TextAlign.left,
                          maxLines: 2,
                          overflow: TextOverflow.ellipsis,
                          style: new TextStyle(
                              fontSize: 18.0, color: Color(0xFF3C4450)),
                        ),
                      ),
                    ),
                  ],
                ),
              ),
              Container(
                height: 20.0,
                child: Row(
                  children: <Widget>[
                    Text(
                      '老板今天多放辣',
                      style:
                          TextStyle(fontSize: 12.0, color: Color(0xFFB4BEC6)),
                    ),
                    Container(
                      margin: EdgeInsets.only(left: 10.0),
                      child: Text(
                        '2019-02-02',
                        style:
                            TextStyle(fontSize: 12.0, color: Color(0xFFB4BEC6)),
                      ),
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
      ],
    );
  }
}

//分类标签主
Widget fenlWidget() {
  return new Swiper(
    itemBuilder: (BuildContext context, int index) {
      return Container(
        margin: EdgeInsets.only(left: 0.0, right: 0.0, top: 40.0),
        child: Column(
          children: <Widget>[
            GestureDetector(
              onTap: () {
                Navigator.of(context).pushNamed(VidPath);
              },
              child: Container(
                height: 175.0,
                margin: EdgeInsets.only(left: 0.0, right: 0.0),
                decoration: BoxDecoration(
                  borderRadius: BorderRadius.circular(5),
                  image: DecorationImage(
                    image: NetworkImage(
                        'https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1562903412&di=7f6cf511ba63129c6c68dcf95829a3ed&imgtype=jpg&er=1&src=http%3A%2F%2Fshihuo.hupucdn.com%2Fucditor%2F20171127%2F1600x1066_983d0e59e521344aa37f0e7943ad8aca.jpeg%3FimageMogr2%2Fformat%2Fjpg%257cimageView2%2F2%2Fw%2F700%2Finterlace%2F1'),
                    fit: BoxFit.cover,
                  ),
                ),
                child: Container(
                  margin: EdgeInsets.only(left: 10.0, right: 10.0, top: 140.0),
                  child: Row(
                    children: <Widget>[
                      Expanded(
                        child: Container(
                          child: Text(
                            '幼年柯基需要断尾吗？幼年柯基需要断尾吗？幼年柯基需要断尾吗？幼年柯基需要断尾吗？',
                            overflow: TextOverflow.ellipsis,
                            style: TextStyle(
                              color: Colors.white,
                              fontSize: 17.0,
                            ),
                          ),
                        ),
                      ),
                      Container(
                        width: 20.0,
                        height: 20.0,
                        child: Image.asset(
                          'assets/user/play-icon.png',
                          fit: BoxFit.contain,
                        ),
                      ),
                      Container(
                        child: Text(
                          '03:15',
                          overflow: TextOverflow.ellipsis,
                          style: TextStyle(
                            color: Colors.white,
                            fontSize: 12.0,
                          ),
                        ),
                      ),
                    ],
                  ),
                ),
              ),
            ),
            Container(
              height: 35.0,
              alignment: Alignment.centerLeft,
              child: Text(
                '顽宠管家 525 浏览 378 赞同',
                style: TextStyle(color: Color(0xFFB4BEC6), fontSize: 12.0),
              ),
            ),
          ],
        ),
      );
    },
    itemCount: 3,
    viewportFraction: 0.8,
    scale: 0.9,
    autoplay: true,
  );
}
